/* #title-container {
    position: relative;
    width: 100%;
    height: 300px;
    top: 10%;
} */

.logo{
    position: absolute;
    top: 300px;
    left: 50%;
    transform: translate(-50%,-50%);
    animation: fill-anm 500ms ease forwards 3000ms;
}

/* 茸 */
.logo path:nth-child(6){
    stroke-dasharray: 533;
    stroke-dashoffset: 533;
    animation: line-anm 4s ease forwards;
}

/* 茸 */
.logo path:nth-child(5) {
    stroke-dasharray: 533;
    stroke-dashoffset: 533;
    animation: line-anm 4s ease forwards 300ms;
}

/* A */
.logo path:nth-child(4) {
    stroke-dasharray: 248;
    stroke-dashoffset: 248;
    animation: line-anm 2s ease forwards 900ms;
}

/* I */
.logo path:nth-child(3) {
    stroke-dasharray: 110;
    stroke-dashoffset: 110;
    animation: line-anm 2s ease forwards 900ms;
}

/* 绘 */
.logo path:nth-child(2) {
    stroke-dasharray: 585;
    stroke-dashoffset: 585;
    animation: line-anm 6s ease forwards 1500ms;
}

/* 画 */
.logo path:nth-child(1) {
    stroke-dasharray: 560;
    stroke-dashoffset: 560;
    animation: line-anm 7s ease forwards 2000ms;
}

/* 填充白色 */
@keyframes fill-anm {
    from {
        fill: transparent;
    }

    to {
        fill: white;
    }
}

@keyframes line-anm{
    to{
        stroke-dashoffset: 0;
    }
}